<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>心动</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link rel="stylesheet" href="css/amazeui.css"/>
    <link rel="stylesheet" href="css/userCenter.css"/>
    <link rel="stylesheet" href="css/mainHeart.css"/>

</head>
<body class="bg-gray">
<div class="main-content" style="margin-bottom: 0;">

    <div class="main-heart-items" data-id="1">
       <div class="main-heart-items-head">
            <div class="head-box1">
                <span class="head-name">高先生</span>
                <img class="icon-vip-img" src="images/icon-vip.png" alt=""/>
            </div>
            <div class="head-box2">
                <span class="fl">30岁</span>
                <div class="fr">
                    <img class="icon-position-img" src="images/icon-position.png" alt=""/>
                    <span>北京</span>
                </div>
            </div>
        </div>
        <div class="main-heart-items-img-box">
            <div>
                <i class="icon-heart"></i>
                <p style="font-size:12px;">动心</p>
            </div>
            <span class="main-heart-items-renzheng">
                已认证身份-学历-车-房
            </span>
            <a href="http://192.168.1.18/mobile/personalInfo.html">
                <img class="main-heart-items-img" src="images/photo1.jpg" alt=""/>
            </a>
        </div>
        <div class="main-heart-items-foot">
            <div><span>178cm</span></div>
            <div><span>本科</span></div>
            <div><span>销售经理</span></div>
            <div><span>有房有车</span></div>
        </div>
    </div>
    <div class="main-heart-items" data-id="15">
        <div class="main-heart-items-head">
            <div class="head-box1">
                <span class="head-name">刘先生</span>
                <img class="icon-vip-img" src="images/icon-vip.png" alt=""/>
            </div>
            <div class="head-box2">
                <span class="fl">30岁</span>
                <div class="fr">
                    <img class="icon-position-img" src="images/icon-position.png" alt=""/>
                    <span>北京</span>
                </div>
            </div>
        </div>
        <div class="main-heart-items-img-box">
            <div>
                <i class="icon-heart heart-red"></i>
                <p style="font-size:12px;">动心</p>
            </div>
            <span class="main-heart-items-renzheng">
                已认证身份-学历-车-房
            </span>
            <a href="personalInfo.html">
                <img class="main-heart-items-img" src="images/photo2.jpg" alt=""/>
            </a>
        </div>
        <div class="main-heart-items-foot">
            <div><span>178cm</span></div>
            <div><span>本科</span></div>
            <div><span>销售经理</span></div>
            <div><span>有房有车</span></div>
        </div>
    </div>
    <div class="main-heart-fenye">
        <a href="">首页</a><a href="">上一页</a><a href="">下一页</a><a href="">尾页</a>
    </div>
    <style type="text/css">
        .main-heart-fenye{
            text-align: center;
        }
        .main-heart-fenye a{
            display: inline-block;
            font-size: 12px;
            width: 50px;
            border: 1px solid #999;
            border-radius: 5px;
            margin: 10px;
        }
    </style>
</div>
<div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default "
     id="">
    <ul class="am-navbar-nav am-cf am-avg-sm-4 my-nav">
        <li>
            <a href="mainHeart.html" class="footer-active">
                <i class="my-icons footer-heart-icon"></i>
                <span class="am-navbar-label">心动</span>
            </a>
        </li>
        <li>
            <a href="userCenter.html" class="">
                <i class="my-icons footer-my-icon"></i>
                <span class="am-navbar-label">我的</span>
            </a>
        </li>
    </ul>
</div>

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/amazeui.js"></script>
<script type="text/javascript">

    var divs = document.getElementsByClassName("main-heart-items-foot");
    function getFontSize(){
        var width=document.documentElement.clientWidth||document.body.clientWidth+"px";
        var fontSize=(100/750)*width;
        return fontSize;
    }
    for(var i=0;i<divs.length;i++){
        divs[i].style.fontSize=getFontSize()+"px";
    }

    window.onresize=function(){
        for(var i=0;i<divs.length;i++){
            divs[i].style.fontSize=getFontSize()+"px";
        }
    };

    $(function () {
        $(".icon-heart").click(function(){
            if($(this).hasClass("heart-red")){
                $(this).removeClass("heart-red");
            }else{
                $(this).addClass("heart-red");
            }
        });
    });
//    console.log($('.main-content .main-heart-items:last-child').attr('data-id'));
    var count = $('.main-content .main-heart-items:last-child').attr('data-id');
    parseInt(count);
    console.log(parseInt(count));
</script>
</body>
</html>